import React, { PureComponent } from 'react'
import { View, ScrollView, StyleSheet, Text } from 'react-native'
import { Table, TableWrapper, Row, Rows, Col, Cols, Cell } from 'react-native-table-component';
import color from '../../utils/color'
import screen from '../../utils/screen'
import { BackIcon, PullView } from '../../widgets'

export default class extends PureComponent {
  static navigationOptions = ({ navigation }) => ({
    title: '指南',
    headerStyle: {
      backgroundColor: color.theme,
      elevation: 0,
      shadowOpacity: 0,
    },
    headerTitleStyle: {
      color: 'white',
      fontSize: screen.pxToDp(30),
      marginLeft: screen.pxToDp(26),
    },
    headerLeft: ( <BackIcon backInvoke={() => { navigation.goBack(null) }}/>),
  })

  getHead = () => {
    return ['项目', '说明']
  }
  getContent = () => {
    return [
      ['支出金额（含税）', '扣除返还金额后实际支付的所有金额，包括价款、税款等，支付形式包括但不限于现金、股权、债权等。'],
      ['支出金额（不含税）', '扣除返还金额后实际支付的所有不含税金额，支付形式包括但不限于现金、股权、债权等。'],
      ['可抵扣增值税额', '自动计算、无需填写。'],
      ['其他税额', '自动计算、无需填写。'],
      ['资金来源', '自动计算、无需填写。'],
      ['自有资金', '以自有资金投入。'],
      ['借款', '以预测年限平均还本，需综合考虑年借款利率的数值。自动计算，无需填写。'],
      ['预测年限', ''],
      ['项目总年限', '合理预测获得的权益的可持续时长。'],
      ['预计从第几年开始正式取得收益', '合理预测从项目开始投入第几年正式开始取得收益。'],
      ['预测第一年收入（含税）', '扣除因退货等原因归还金额后实际收到的所有含税收入，假设均为现金收入。'],
      ['预测第一年收入（不含税）', '扣除因退货等原因归还金额后实际收到的所有不含税收入，假设均为现金收入。自动计算，无需填写。'],
      ['税额', '自动计算，无需填写。'],
      ['收入增长率', '预测年限中收入的年均增长率。'],
      ['营业成本收入比', '不含税年营业成本同不含税年收入的比。'],
      ['销售费用收入比', '年销售费用同不含税年收入的比。'],
      ['管理费用收入比', '年管理费用同不含税年收入的比。'],
      ['财务费用收入比', '年财务费用同不含税年收入的比，且该年财务费用不包括资源来源中借款的利息。'],
      ['折旧收入比', '年折旧同不含税年收入的比。'],
      ['预测末期处置全部权益可回收或需支付的资金', '例如固定资产残值。'],
      ['增值税率及附加费率', ''],
      ['收入适用的增值税税率', '在不考虑增值税退税、返还等情况下，预测期内收入适用的平均增值税税率。'],
      ['营业成本适用的增值税税率', '在不考虑增值税退税、返还等情况下，预测期内营业成本适用的平均增值税税率。'],
      ['支出金额适用的增值税税率', '基期支出金额适用的平均增值税税率。'],
      ['附加税率', '城建税、教育附加费等。'],
      ['增值税返还率', '是否适用增值税返还，若不适用，则为0。'],
      ['所得税率', '预测期内适用的平均所得税率。'],
      ['借款利率', '资金来源中借款的年平均利率。'],
      ['通胀率', '预测期内平均年通胀率。'],
    ]
  }
  render() {
    const head = this.getHead()
    const content = this.getContent()
    return (
      <View style={styles.container}>
        <ScrollView>
          <Table borderStyle={{borderWidth: 0, borderColor: '#bfbfbf' }}>
            <Row data={head} flexArr={[2,3]} style={styles.head} textStyle={styles.text}/>
            <Rows textStyle={styles.text} data={content} flexArr={[2,3]} style={styles.row}/>
          </Table>
        </ScrollView>
      </View>
    )

  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#fff',
    padding: screen.pxToDp(20)
  },
  text: {
    margin: 6,
  }
})
